<script src="<?php echo base_url(); ?>js/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"></script>
<script src="<?php echo base_url(); ?>js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
<script src="<?php echo base_url(); ?>js/profile.js" type="text/javascript" charset="utf-8"></script>
<script src="<?php echo base_url(); ?>js/jquery-ui-1.10.3.custom.min.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="<?php echo base_url(); ?>css/ui-lightness/jquery-ui-1.10.3.custom.min.css">
<script>
$(document).ready(function(){
    $("#change-password-form").validationEngine('attach');
     $("#date").datepicker({ minDate: new Date(),dateFormat: "yy-mm-dd" });
     $("#date1").datepicker({ minDate: new Date(),dateFormat: "yy-mm-dd" });
     $("#date2").datepicker({ minDate: new Date(),dateFormat: "yy-mm-dd" });
     $("#date3").datepicker({ minDate: new Date(),dateFormat: "yy-mm-dd" });
     $("#date4").datepicker({ minDate: new Date(),dateFormat: "yy-mm-dd" });
     $("#date5").datepicker({ minDate: new Date(),dateFormat: "yy-mm-dd" });
     $("#date6").datepicker({ minDate: new Date(),dateFormat: "yy-mm-dd" });
     $("#date7").datepicker({ minDate: new Date(),dateFormat: "yy-mm-dd" });
     $("#date8").datepicker({ minDate: new Date(),dateFormat: "yy-mm-dd" });
     $("#date9").datepicker({ minDate: new Date(),dateFormat: "yy-mm-dd" });
    update_matpel_all();
});

var rowNum = 0;
function addRow(frm) {
	rowNum ++;
	var row = '<div  id="rowNum'+rowNum+'"><table id="profile-lamar-table"><tr class="center"><td class="center">Tanggal Kelas</td><td colspan="2" class="center"><input type="text" name="date[]" class="field size5 text" id="date'+rowNum+'"></td></tr><tr class="center"><td class="center">Jam Mulai - Selesai</td><td><select class="inline-field size5" name="mulai_jam[]"><option value="6">06</option><option value="7">07</option><option value="8">08</option><option value="9">09</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23"></option></select><select class="inline-field size5" name="mulai_menit[]"><option value="00">00</option><option value="15">15</option><option value="30">30</option><option value="45">45</option></select></td><td class="center"><select class="inline-field size5" name="selesai_jam[]"><option value="6">06</option><option value="7">07</option><option value="8">08</option><option value="9">09</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23"></option></select><select class="inline-field size5" name="selesai_menit[]"><option value="00">00</option><option value="15">15</option><option value="30">30</option><option value="45">45</option></select><select class="inline-field size5" name="waktu[]"><option value="1">WIB</option><option value="2">WITA</option><option value="3">WITA</option></select></td></tr><a href="#" class="normal-link bold" onclick="removeRow('+rowNum+');">Hapus</a></table></div>';
	jQuery('#itemRows').append(row);
}

function removeRow(rnum) {
	jQuery('#rowNum'+rnum).remove();
}
</script>
<div id="content">
    <div class="blank" style="height:30px;"></div>
    <div id="profile-guru-wrap">
        <?php echo $menu;?>
        <div id="profile-guru">
            <div id="profile-guru-header">
                <div id="profile-guru-header-wrap">
                    BUKA KELAS               
			</div>
            </div>
            <div id="profile-guru-content">
                <div id="pgc-wrap">
                    <div class="pgc-section">
                        <div class="header">
					   <p class="text-13 justify">Buka kelas adalah fitur baru di Ruangguru. Anda sebagai guru dapat membuat kelas sesuai dengan mata pelajaran yang Anda kuasai dalam kurun waktu yang singkat.</p>
					   <p class="text-13 justify">Kelas ini akan terbuka untuk umum dan untuk siapa saja bisa mendaftar untuk mengikuti kelas Anda</p>
                        </div>
                        <div class="content">
				     <form id="form-buka-kelas" class="profile-form" action="<?php echo base_url(); ?>profile/kelas_submit" method="post" enctype="multipart/form-data">
				      <table id="profile-lamar-table">
                                <tbody>
							 <tr>
                                        <td class="center">Nama Kelas</td>
								<td class="center" colspan="2"><input id="nama" type="text" class="field size2 validate[required] text" name="nama" /></td>
                                    </tr>
							 <tr>
                                        <td class="center">Tentang Kelas</td>
								<td class="center" colspan="2"><textarea id="deskripsi" type="text" class="field size2 validate[required] text" name="deskripsi"></textarea></td>
                                    </tr>
							 <tr>
                                        <td class="center">Jenjang Pendidikan</td>
								<td class="center" colspan="2">
									 <select id="select-jenjang" name="jenjang" onchange="update_matpel_all()">
										<?php foreach($jenjang->result() as $item):?>
										<option value="<?php echo $item->jenjang_pendidikan_id;?>"><?php echo $item->jenjang_pendidikan_title;?></option>
                                                 <?php endforeach;?>
                                              </select>
								</td>
                                    </tr>
							 <tr>
                                        <td class="center">Mata Pelajaran</td>
								<td class="center" colspan="2"><select id="select-matpel" name="matpel"></select></td>
                                    </tr>
							 <tr>
                                        <td class="center">Mata Pelajaran Lainnya</td>
								<td class="center" colspan="2"><input id="matpel_lain" type="text" class="field size5 text" name="matpel_lain"/><br/>
									<p class="text-11">* Jika mata pelajaran yang Anda ingin ajarkan tidak ada di pilihan tersebut</p>
								</td>
							 </tr>
							  <tr>
                                        <td class="center">Target Peserta</td>
								<td class="center" colspan="2">
									<input id="target" type="text" class="field size5 text" name="target"/>
									<br/>
									<p class="text-11">* Misal: pemula, pelajar SMA, pelajar SMP</p>
								</td>
							 </tr>
							 <tr>
                                        <td class="center">Tarif per pertemuan (per murid)</td>
								<td class="center" colspan="2"><input id="tarif" type="text" class="field size2 validate[required] text" name="tarif" /><br/>
									<p class="text-11">* Masukkan angkanya saja. Misal: 50000</p>
								</td>
                                    </tr>
							 <tr>
                                        <td class="center">Alamat Lokasi Kelas</td>
								<td class="center" colspan="2"><textarea id="lokasi" type="text" class="field size2 validate[required] text" name="lokasi"></textarea></td>
                                    </tr>
							 <tr>
                                        <td class="center">Video</td>
								<td class="center" colspan="2">
									<input id="link" type="text" class="field size2 text" name="link_video" /><br/>
									<p class="text-11">* Masukkan link video youtube Anda (jika ada).<br/>Misal: http://www.youtube.com/watch?v=CNoD5xEMYfU</p>
								</td>
                                    </tr>
							 <tr>
                                        <td class="center">Foto (Poster)</td>
								<td class="center" colspan="2"><input id="gambar" type="file" class="field size2 text" name="gambar" />
								<br/><p class="text-11">* Masukkan foto kegiatan kelas Anda (jika ada)</p>
								</td>
                                    </tr>
                                </tbody>
                            </table>
					   <table id="profile-lamar-table">	
						  <tr>
                                   <td class="center">Tanggal Kelas</td>
							<td class="center" colspan="2"><input id="date" type="text" class="field size5 validate[required] text" name="date[]" /></td>
                                </tr>
						  <tr>
                                   <td class="center">Jam Mulai - Selesai</td>
						     <td class="center">
								<select class="inline-field size5" name="mulai_jam[]">
								<?php for($i=6;$i<24;$i++):?>
									<option value="<?php echo $i;?>"><?php echo str_pad($i, 2,"0",STR_PAD_LEFT);?></option>
								<?php endfor;?>
								</select>
								<select class="inline-field size5" name="mulai_menit[]">
									<option value="00">00</option>
									<option value="15">15</option>
									<option value="30">30</option>
									<option value="45">45</option>
								</select>
							</td>
							<td class="center">
								<select class="inline-field size5" name="selesai_jam[]">
									<?php for($i=6;$i<24;$i++):?>
										<option value="<?php echo $i;?>"><?php echo str_pad($i, 2,"0",STR_PAD_LEFT);?></option>
									<?php endfor;?>
								</select>
								<select class="inline-field size5" name="selesai_menit[]">
									<option value="00">00</option>
									<option value="15">15</option>
									<option value="30">30</option>
									<option value="45">45</option>
								</select>
								<select class="inline-field size5" name="waktu[]">
									<option value="1">WIB</option>
									<option value="2">WITA</option>
									<option value="3">WIT</option>
								</select>
							</td>
                                </tr>
						</table>
						<div class="blank" style="height:10px;"></div>
						<div id="itemRows"></div>
						<div class="blank" style="height:10px;"></div>
						<input type="image" src="<?php echo base_url();?>images/simpan-button.png" class="fright"/>
						<a href="#" onclick="addRow(this.form);"><img src="<?php echo base_url();?>images/tambah-jam.png" class="fright"/></a>
					 </form>
					 <div class="blank" style="height:30px;"></div>
					   <?php if($kelas->num_rows() >= 1){ ?>
				        <p class="bold">DAFTAR KELAS ANDA</p>
					   <p>Di bawah ini adalah daftar kelas Anda yang telah diadakan/ masih berlangsung di Ruangguru.</p>
				        <table id="profile-lamar-table">
                                <thead>
                                    <th class="center">No.</th>
                                    <th class="center">Nama Kelas</th>
                                    <th class="center" width="320px">Tentang Kelas</th>
                                    <th class="center">Lokasi</th>
                                </thead>
                                <tbody>
							<?php $i=1; foreach($kelas->result() as $row){ ?>
							<tr>
                                        <td class="center"><?php echo $i++;?></td>
                                        <td class="center"><?php echo $row->kelas_guru_nama;?></td>
                                        <td><?php echo $row->kelas_guru_deskripsi;?></td>
								<td class="center"><?php echo $row->kelas_guru_lokasi;?></td>
                                    </tr>
							<?php  } ?>
                                </tbody>
                            </table>
					   <?php  } ?>
                        </div>
                    </div>
                </div>
                <div class="clear" ></div>
                <div class="blank" style="height:60px;"></div>
            </div>
            <div class="blank" style="height:10px;"></div>
        </div>
        <div class="clear"></div>
    </div>
    <div class="blank" style="height:30px;"></div>
</div>